<template>
	<view class="app">
		<!-- 头部 -->
		<image src="https://image04.dujiabieshu.com/uploads/mobile/poster/20220817114335_1734.jpg" class="head-img">
		</image>
		<!-- 黑色透明度 -->
		<template v-if="userInfo.nickName">
			<view class="head-clarity">
				<view style="display: flex;padding-top: 40rpx;">
					<view class="myinfo_headbox">
						<view class="headbox">
							<img :src="userInfo.avatarUrl" v-if="userInfo.avatarUrl" alt="" class="headimg_css">
						</view>
					</view>
					<view class="head-text">
						<view class="head-text-login">{{userInfo.nickName}}</view>
					</view>
				</view>
			</view>
		</template>

		<template v-else>
			<view class="head-clarity">
				<navigator url="../../commodity/pages/login/login">
					<view style="display: flex;padding-top: 20rpx;">
						<view class="head-picture"></view>
						<view class="head-text">
							<view class="head-text-login">登录/注册</view>
							<view class="head-text-register">注册即送900！</view>
						</view>
					</view>
				</navigator>
			</view>
		</template>



		<!-- 标题 -->
		<template v-if="userInfo.nickName">
		<view class="title">
			<view class="title-info">
				<view> 0&nbsp;张 </view>
				<view> 优惠券 </view>
			</view>
			<view class="title-info">
				<view> 0 </view>
				<view> 积分 </view>
			</view>
			<view class="title-info">
				<view> 0 </view>
				<view> 钱包 </view>
			</view>
		</view>
		</template>
		
		<template v-else>
		<view class="title">
			<view class="title-info">
				<view> ?&nbsp;张 </view>
				<view> 优惠券 </view>
			</view>
			<view class="title-info">
				<view> ? </view>
				<view> 积分 </view>
			</view>
			<view class="title-info">
				<view> ? </view>
				<view> 钱包 </view>
			</view>
		</view>
		</template>
		
		<!-- 我的订单 -->
		<view class="order">
			<view class="order-title">我的订单</view>
			<view class="order-info">
				<navigator url="../../commodity/pages/order/order">
				<view class="order-infos">
					<image src="../../static/image/my/dingdan.svg"></image>
					<view class="order-info-text">所有订单</view>
				</view>
				</navigator>
				<view class="order-infos">
					<image src="../../static/image/my/daifukuan.svg"></image>
					<view class="order-info-text">待付款</view>
				</view>
				<view class="order-infos">
					<image src="../../static/image/my/weichuli.svg"></image>
					<view class="order-info-text">处理中</view>
				</view>
				<view class="order-infos">
					<image src="../../static/image/my/yifukuan.svg"></image>
					<view class="order-info-text">已付款</view>
				</view>
			</view>
		</view>
		<!-- 其他功能 -->
		<view class="order" style="height: 500rpx;margin-top: 40rpx;">
			<view class="order-title">
				我的邀请
				<view class="right_icobox">
					<img src="../../static/image/my/Right_arrow.png" alt="" style="width: 25px;height: 25px;">
				</view>
			</view>
			<view class="order-title">
				我的发票
				<view class="right_icobox">
					<img src="../../static/image/my/Right_arrow.png" alt="" style="width: 25px;height: 25px;">
				</view>
			</view>
			<view class="order-title">
				我的定制
				<view class="right_icobox">
					<img src="../../static/image/my/Right_arrow.png" alt="" style="width: 25px;height: 25px;">
				</view>
			</view>
			<view class="order-title" style="border: none;">
				关于我们
				<view class="right_icobox">
					<img src="../../static/image/my/Right_arrow.png" alt="" style="width: 25px;height: 25px;">
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo: {},
			}
		},
		mounted() {
			wx.getStorage({
				key: 'userinfo',
				success: res => {
					this.userInfo = JSON.parse(res.data);
				}
			})
		},
		
		methods: {

		}
	}
</script>

<style>
	@import url(../../static/css/myinfo.css);
</style>
